
import React, {
  Component,
  StyleSheet,
  Text,
  View,
  TouchableOpacity,
  TextInput,
} from 'react-native';

var Title =require('./Title');
var query = require('./Query').query;

class ModifyPwd extends Component{

  constructor(props){
    super(props);
    this.user = this.props.user;
    this.state = {phone:'',
        old_pwd:'',
        new_pwd:'',
        new_pwd_again:'',
      };
  }


  _onPressReturn(){
    this.props.navigator.pop();
  }


  _onPressConfirm(){
  }


  render(){
    return(
      <View style={styles.container}>
        <Title title={{left:"返回",center:"修改密码",right:"确认",
              leftAct:this._onPressReturn.bind(this),rightAct:this._onPressConfirm.bind(this)}}></Title>

        <View style={styles.innerContainer}>

          <View style={[styles.flowRight,styles.bottomLine]}>
            <Text style={styles.text}>账    号 :</Text>
            <Text style={{flex:3}}>{this.props.user.phone}</Text>
          </View>

          <View style={[styles.flowRight,styles.bottomLine]}>
            <Text style={styles.text}>旧 密 码 :</Text>
            <TextInput style={styles.input} placeholder='请输入原密码' 
              secureTextEntry = {true}
              onChangeText={(value)=>{this.setState({old_pwd:value})}}/>
          </View>

           <View style={[styles.flowRight,styles.bottomLine]}>
           <Text style={styles.text}>新 密 码 :</Text>
            <TextInput style={styles.input} placeholder='请输入新密码' 
              secureTextEntry = {true}
              onChangeText={(value)=>{this.setState({new_pwd:value})}}/>
          </View>

           <View style={[styles.flowRight,styles.bottomLine]}>
            <Text style={styles.text}>确认密码:</Text>
            <TextInput style={styles.input} placeholder='请再次输入新密码' 
              secureTextEntry = {true}
              onChangeText={(value)=>{this.setState({new_pwd_again:value})}}/>
          </View>
        </View>

      </View>
    )

  }
}

/**
 * 定义本模块的样式表
 * @type {*|{type, property}|{panHandlers}|Object|{duration, create, update}|Config}
 */
const styles = StyleSheet.create({
  container: {
    backgroundColor: '#eeeeee',
    flex: 1,
  },
  innerContainer:{
    backgroundColor: '#FFF',
  },
  flowRight:{ //账号、密码、登录
    height:50,
    flexDirection: 'row', //水平排布
    alignItems: 'center', //中心线对齐
    marginLeft:20,
    marginRight:20,
  },
  bottomLine:{
    borderBottomWidth:1,
    borderBottomColor:'#eeeeee',
  },
  text:{
    flex:1,
    fontSize:16,
    color:'#04679b',
  },
  input:{
    flex:3,
    fontSize:14,
    color:'#bbbbbb',
  },
  
})

/**
 * 导出请假申请列表模块
 * @type {LeaveList}
 */
module.exports = ModifyPwd;
